<template>
	<view class="wrap">
		<view class="back" @tap="back">
			<image :src="$imgUrl('/lt_back.png')" mode="scaleToFill" />
		</view>
		<view class="content">
			<view class="u-page__item__title">功能介绍</view>
			<u-collapse @change="change" @close="close" @open="open" :value="['1']">
				<u-collapse-item title="魔法相机" name="1">
					<text
						class="u-collapse-content">步骤一：\n在魔法相册上传图片与视频，并保存。\n步骤二：\n打开魔法相机，对准魔法相册中的图片扫一扫后，\n稍等片刻!\n魔法相册次数可以通过兑换码、官方活动、签到等获得。\n多次扫描需要按重置按钮。</text>
				</u-collapse-item>
				<u-collapse-item title="AR扫一扫" name="2">
					<text
						class="u-collapse-content">打开AR扫一扫功能，授权定位信息。\n将根据所扫描的地点展示相关模型或视频,\n同时可根据需要进行拍照或保存视频。\n会随机发放优惠券、红包等!\n更多惊喜彩蛋可扫描商家活动物品，玩偶等。\n多次扫描需要按重置按钮。</text>
				</u-collapse-item>
				</u-collapse-item>
				<u-collapse-item title="相册" name="3">
					<text class="u-collapse-content">相册具备网盘功能，可上传图片或视频，\n如有需要可下载至手机，\n磁盘空间可通过魔法相机扫描官方活动或签到获得。</text>
				</u-collapse-item>
				<u-collapse-item title="积分说明" name="4">
					<text
						class="u-collapse-content">积分可以通过签到、分享、观看视频等方式获得，\n积分可以兑换魔法相册上传次数每次消耗300积分，\n使用首页相关AI作画等功能会扣除一定量积分\n</text>
				</u-collapse-item>
				<u-collapse-item title="积分说明" name="4">
					<text
						class="u-collapse-content">积分可以通过签到、分享、观看视频等方式获得，\n积分可以兑换魔法相册上传次数，\n使用首页相关AI作画等功能会扣除一定量积分\n</text>
				</u-collapse-item>
				<u-collapse-item title="商务合作及建议反馈" name="5">
					<text
						class="u-collapse-content">商务合作及建议反馈，可通过“我的-客服”联系官方!\n工作时间：每周一至周五，9:00-18:00</text>
				</u-collapse-item>
			</u-collapse>
		</view>

	</view>


</template>

<script>
	export default {
		data() {
			return {

			};
		},
		methods: {
			onShow() {

			},
			back() {
				uni.navigateBack()
			},
			open(e) {
				// console.log('open', e)
			},
			close(e) {
				// console.log('close', e)
			},
			change(e) {
				// console.log('change', e)
			}
		}
	};
</script>

<style lang="scss" scoped>
	.wrap {
		background: url($imgUrl + "/lt_bg.jpg") no-repeat;
		background-size: 100% 100%;
		width: 750rpx;
		height: 100vh;

		.back {
			width: 95%;
			margin: 0 auto;
			padding-top: calc(var(--status-bar-height) + 60rpx);
			height: 120rpx;

			image {
				width: 76rpx;
				height: 64rpx;
			}
		}

	}

	.content {
		width: 90%;
		margin: 0 auto;
		background-color: #fff;
		border-radius: 12rpx;

		// padding: 20rpx ;
		.u-page__item__title {
			border-top-left-radius: 12rpx;
			border-top-right-radius: 12rpx;
			color: $u-tips-color;
			background-color: $u-bg-color;
			padding: 30rpx;
			font-size: 30rpx;
		}
	}
</style>